<!DOCTYPE html>
<html>

  <head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta content="telephone=no" name="format-detection">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <title>待结账</title>
    <!-- 引入css -->
    <link rel="stylesheet" href="./css/ionic-change.css">
    <link rel="stylesheet" href="./css/order.css">
    <link rel="stylesheet" href="./js/tc/weui2.css">

  </head>

  <body style="background-color: #eeeeee;">
    <div class="xq_main" style="background:#fff">
      <!--待确认第一部分-->
      <div class="dqr_one">
        <div class="left">
          <img src="./images/djz.png" />
        </div>
        <div class="right">
          <span class="Status">待结账</span>
          <p>预计订单总额 <span>￥1200</span></p>
        </div>
      </div>
      <!--待确认车辆详细信息-->
      <div class="dqr_car_info">
        <div class="dqr_car_info--item">
          <div class="confrim_top">
            <img src="./images/car01.png" alt="">
          </div>
          <div class="car_info">
            <span class="title">新BMW 4系敞篷轿跑车</span>
            <p class="order">
              <span class="name">三厢</span>
              <span class="type">2.0自动</span>
              <span>乘坐5人</span>
            </p>
          </div>
        </div>
      </div>
      <!--待确认时间-->
      <div class="confirm_times">
        <div class="left">
          <span>2天</span>
        </div>
        <div class="right">
          <div class="quche_time">
            <div class="confirm_times2">
              <span class="date">08月25日</span>
              <span class="time">今天17:15</span>
            </div>
            <div class="confirm_info">
              <span class="stauts">到店取车</span>
              <span class="address">杭州－萧山区－萧山机场店</span>
            </div>
          </div>
          <div class="hc_time">
            <div class="confirm_times2">
              <span class="date">08月25日</span>
              <span class="time">今天17:15</span>
            </div>
            <div class="confirm_info">
              <span class="stauts">到店取车</span>
              <span class="address">杭州－萧山区－萧山机场店</span>
            </div>
          </div>
        </div>
      </div>
      <!-- 费用明细 -->
      <div class="Cost_main">
        <div class="cost_title"><span>基本费用</span></div>
        <div class="Cost_detail_main">
          <ul>
            <li>
              <span class="txt">车辆租赁及服务费</span>
              <p><span>2</span>×<span>800</span>=<em>￥1600</em></p>
            </li>
            <li>
              <span class="txt servive">基础服务费<img src="./images/wh.png" alt=""></span>
              <p><span>2</span>×<span>40</span>=<em>￥1600</em></p>
            </li>
            <li class="sj">
              <span class="txt driver">带司机<img src="./images/wh.png" alt=""></span>
              <p><span>2</span>×<span>40</span>=<em>￥80</em></p>
            </li>
            <li>
                <span class="txt timeout">超时服务费<img src="./images/wh.png" alt=""></span>
                <p><span>2</span>×<span>40</span>=<em>￥80</em></p>
              </li>
          </ul>
        </div>
      </div>


      <!--底部固定-->
      <div class="dqrfoot">
          <span class="proceed_checkout orderbgcolor"><a href="WeiXin_xzzffs.html" style="color:#fff">去结账</a></span>
          
      </div>
    </div>


   
    <!-- 基础服务费 -->
    <div class="mask hide">
      <div class="service_info">
        <div class="service_info--item">
          <div class="title">带司机</div>
          <div class="con">
            必选部分，用户只需承担1500元以
            内的车辆损失费。
          </div>
        </div>
        <div class="Explain_btn">
          我知道了
        </div>
      </div>
    </div>
    <!-- 带司机 -->
    <!-- 选择司机 -->
    <div class="mask2 hide">
      <div class="Explain">
        <div class="Explain--item">
          <div class="title">带司机</div>
          <div class="con">
            连续多日订单，驾驶员需要陪同在异地过夜的情况下，客户需要按300元/晚的标准支付食宿费；连续多日订单但在同城内，驾驶员可回家休息的情况下，该费用用户不需要支付。
          </div>
        </div>
        <div class="Explain_btn">
          我知道了
        </div>
      </div>
    </div>

  </body>
  <script src="./js/jquery.min.js"></script>
  <script src="./js/rem.js"></script>
  <!--弹框-->
  <script type="text/javascript" src="./js/tc/zepto.min.js"></script>
  <script>
 
    $('.servive').on('click', function () {
      $(".mask").fadeIn(300);
    })
    $('.Explain_btn').on('click', function () {
      $(".mask").fadeOut(300);
    })
    $('.driver').on('click', function () {
      $(".mask2").fadeIn(300);
    })
    $('.Explain_btn').on('click', function () {
      $(".mask2").fadeOut(300);
    })
    //选择司机
    $('.Agree').on('click', function () {
      $(this).children().toggleClass("active");
    })

  </script>

</html>